@media (max-width: 768px) {
	.mh {
		display: none !important;
	}
	.dkh {
		display: flex;
	}
}
@media (min-width: 769px) {
	.dkh {
		display: none !important;
	}
}

.is-firefox-mobile {
	font-size: 20px;
}
.is-mobile-safari {
	-webkit-text-size-adjust: 112.5%;
}

.is-tablet {
	--clipper-button-font-weight: 600;
	--clipper-button-font-size: 0.875rem;
}

.is-tablet,
.is-mobile {
	height: 100%;
	--background-modifier-form-field: var(--background-secondary);
	--clickable-icon-size: 2rem;

	--dialog-height: 100svh;
	--dialog-width: 100svw;
	--dialog-max-width: 100svw;
	--dialog-max-height: 100svh;

	--icon-size: 1rem;
	--input-height: 2.25rem;
	--input-shadow: none;
	--input-shadow-hover: none;

	--interactive-normal: var(--color-base-20);

	--metadata-label-width: 6rem;

	--modal-border-width: 0;
	--modal-radius: 0;
	--modal-padding: 1rem 1.5rem;

	--popup-padding: 1rem;
	--popup-properties-padding: 2px 0.75rem 0.75rem;

	a, button, label, input, textarea, select {
		-webkit-tap-highlight-color: transparent;
	}	
	button {
		font-weight: 600;
		--input-height: 2.5rem;
		border: 0;
		box-shadow: none;
	}
	input,
	input[type="password"],
	input[type="text"],
	textarea,
	select {
		border: none;
		border-radius: var(--radius-m);
	}
}

.is-mobile {
	--bottom: -200px;
	--transition: bottom 0.2s ease-in-out;

	--toggle-width: 3rem;
	--toggle-radius: 1.5rem;
	--toggle-thumb-radius: 1.5rem;
	--toggle-thumb-height: 1.5rem;
	--toggle-thumb-width: 1.5rem;

	button {
		border-radius: 2rem;
	}
	.clipper {
		max-height: 100dvh;
		width: 100%;
	}
	.clipper .clipper-footer {
		will-change: bottom;
		position: absolute;
		bottom: 0;
		transition: bottom 0.2s ease-in-out;
		padding: calc(var(--popup-padding) / 2) var(--popup-padding) 0;
		button {
			font-weight: 600;
		}
		.vault-path-container {
			gap:calc(var(--popup-padding) / 2);
		}
	}
	#embedded-mode {
		display: none;
	}
}
.resizing { 
	.clipper .clipper-footer {
		opacity: 0;
		bottom: var(--bottom);
		transition: var(--transition);
	}
}
